<template>
  <BaseFilter class="switch-filter" :label="label">
    <van-switch slot="right"
      :value="value"
      size="24px"
      :active-color="activeColor"
      :inactive-color="inactiveColor"
      @input="onChange"
    />
  </BaseFilter>
</template>

<script>
import BaseFilter from './BaseFilter.vue';

export default {
  name: 'switchFilter',
  props: {
    label: {
      type: String
    },
    value: {
      type: Boolean,
      default: false
    },
    activeColor: {
      type: String,
      default: '#1989fa'
    },
    inactiveColor: {
      type: String,
      default: '#E8E8E8'
    }
  },
  components: {
    BaseFilter
  },
  methods: {
    onChange (value) {
      this.$emit('input', value);
      this.$emit('change', value);
    }
  }
}
</script>

<style>
</style>
